<script setup>

import moduleJson from "@/components/page/moduleJson"
import dataJson from "@/components/page/dataJson"
import {inject, nextTick, onMounted, reactive, ref, toRaw, toRefs, unref} from "vue";
import {CloseBold, Delete, EditPen, Plus} from "@element-plus/icons-vue";
import ModelsService from "@/service/impl/ModelsService.js";
import ModelsModel from "@/model/ModelsModel.js"

const t = inject('$t')
const message = inject('message')
const data = dataJson()
const module = moduleJson()
const modelsModel = ref(new ModelsModel())
const pageTable = ref()
const loading = ref(false)
const titleList = ref([])
const classType = ref(null)
const models = ref([
    {
        value: 'Ollama',
        label: 'Ollama'
    }
])

const init = () => {
    data.value.data.classType = classType.value
    ModelsService.configList(data.value.source()).then(res => {
        data.value.init(res)
    }).catch(e => {

    })
}
const editOpen = (data,index,type) => {
    const fun = {
        0: () => {
            modelsModel.value = new ModelsModel()
        },
        1: () => {
            modelsModel.value = data
        }
    }
    fun[type]()
    module.value.dialog.show = true
    module.value.dialog.load = false
}
const editConfirm = () => {
    if(!classType.value){
        message.warning("请选择模型类型")
        return
    }
    module.value.dialog.load = true
    modelsModel.value.classType = classType.value
    ModelsService.configEdit(modelsModel.value).then(res => {
        module.value.dialog.load = false
        module.value.dialog.show = false
        init();
    }).catch(e => {
        module.value.dialog.load = false
    })
}
const delConfirm = (data,index) => {
    ModelsService.configDel(data).then(res => {
        message.success("删除成功")
        init();
    })
}

onMounted(() => {
    module.value.init(ModelsService.url.configEdit, ModelsService.url.configEdit,
        ModelsService.url.configDel, null, null)
    module.value.operations.width = "200px"
    module.value.dialog.width = "40%"
    ModelsService.classList({}).then(res => {
        titleList.value = res.data
    })
})

</script>
<template>
    <Page
        @refresh="init"
        :data="data"
        :module="module"
        @edit-open="editOpen"
        @edit-confirm="editConfirm"
        @del-confirm="delConfirm"
        ref="pageTable"
    >
        <template #table>

        </template>
        <template #table-left>
        </template>
        <template #operate-before>
            <el-select v-model="classType" clearable  style="width: 200px;margin:0 15px 0 15px"
                       @change="init">
                <el-option
                    v-for="item in titleList"
                    :key="item.classType"
                    :label="item.className"
                    :value="item.classType"
                />
            </el-select>
        </template>
        <template #operate-after>
        </template>
        <template #table-column>
            <el-table-column prop="name" label="标题" />
            <el-table-column prop="baseUrl" label="模型地址" />
            <el-table-column prop="appKey" label="APPKey" />
            <el-table-column prop="model" label="模型名称" />
            <el-table-column prop="createTime" :label="$t('btn.createTime')" />
        </template>
        <template #after-table-event="row">
        </template>
        <template #table-dialog>
            <el-form :rules="modelsModel.rules" :label-width="110" :label-position="'left'"
                     :model="modelsModel" style="width: 100%;padding: 5px">
                <el-form-item label="模型类型" >
                    <el-select v-model="modelsModel.tag" >
                        <el-option
                            v-for="config in models"
                            :key="config.value"
                            :label="config.label"
                            :value="config.value"
                        />
                    </el-select>
                </el-form-item>
                <el-form-item label="标题" prop="name">
                    <el-input v-model="modelsModel.name" autocomplete="off"/>
                </el-form-item>
                <el-form-item label="模型地址" prop="baseUrl">
                    <el-input v-model="modelsModel.baseUrl" autocomplete="off"/>
                </el-form-item>
                <el-form-item label="APPKey" prop="appKey">
                    <el-input v-model="modelsModel.appKey" autocomplete="off"/>
                </el-form-item>
                <el-form-item label="模型名称" prop="model">
                    <el-input v-model="modelsModel.model" autocomplete="off"/>
                </el-form-item>
            </el-form>
        </template>
        <template #table-search>

        </template>

    </Page>

</template>

<style lang="scss" scoped>

</style>
